<script setup lang="ts">
import { ref, onMounted, reactive, nextTick } from "vue";
import Banner from "@/components/Banner.vue";

onMounted(async () => {
    await nextTick(); // 确保DOM已经渲染完成

});


</script>

<template>
    <FitScreen :width="1920" :height="1080" mode="fit">
        <div class="maxBox">
            <div class="maxBox-top">
                <div class="maxBox-left">
                    <div class="tab-item">
                        <img src="../../assets/zhuHome/icon1.png" alt="">
                        <div class="tab-item-right">
                            <div>ME-iPOWER</div>
                            <div>电力负载管理系统</div>
                        </div>
                    </div>
                    <div class="tab-item"> </div>
                    <div class="tab-item"> </div>
                    <div class="tab-item"> </div>
                    <div class="tab-item"> </div>
                    <div class="tab-item"> </div>
                </div>
                <div class="maxBox-right">

                </div>
            </div>

            <div class="maxBox-bom">
                <Banner :value="50" :critical="5" :urgent="15" :non-urgent="40" />
            </div>

        </div>
    </FitScreen>
</template>

<style lang='scss' scoped>
@use "index";
</style>
